<meta charset="utf-8">
    <meta name="sogou_site_verification" content="aJMRbJnzqm"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>${TITLE}</title>
    <meta name="keywords" content="${KEYWORDS}">
    <meta name="description" content="${DESCRIPTION}">
    <link rel="shortcut icon" href="/static/favicon.ico">
    <link href="/bootstrap-4.5.2-dist/css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/jslib/flickity/flickity.css">
    <link rel="stylesheet" href="/jslib/viewjs/css/viewer.min.css">
    <style>
        body{background:#f6f6f6}
        .bg-light {
            background: #2765f5;
            background: -moz-linear-gradient(left, #2665f5, #36e9c3);
            background: -webkit-gradient(linear, left top, right top, from(#2665f5), to(#36e9c3));
            background: -webkit-linear-gradient(left, #2665f5, #36e9c3);
            background: -o-linear-gradient(left, #2665f5, #36e9c3);
            background: -ms-linear-gradient(left, #2665f5 0%, #36e9c3 100%);
            background: linear-gradient(to right, #2665f5 0%, #36e9c3 100%);
            /* border-bottom: 1px solid #F6F6F6; */
            /* position: fixed; */
            top: 0;
            left: 0;
            width: 100%;
            z-index: 99;
            min-height:100px;

        }
        .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
            color: rgba(255,255,255,1);
        }
        .navbar-light .navbar-nav .nav-link{color:rgba(255,255,255,.5)}
        .navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover{color:rgba(255,255,255,.7)}
        .navbar-light .navbar-text a:hover{color:rgba(255,255,255,.9)}

        #logoimg{
            width: 223px;
            height: 82px;
        }
        .logoNew{
            position:relative;
            right:40px;
            top:2px;
            background:#f94c30;
            color:#FFF;
            padding:0 5px;
            height:15px;
            line-height:16px;
            border-radius:5px;
            font-size:12px;
        }

        .submain1{

        }
        .submain2{

        }





        .mycls{
            padding-left: 10px;
        }
        /*未访问链接*/
        .mycls a:link {color:rgb(0,0,0,.9)}
        /*已访问链接 */
        .mycls a:visited{color:rgb(0,0,0,.7)}

        /*a:active：激活时（链接获得焦点时）链接的颜色 ,如 */
        .mycls a:active{color:rgb(0,0,0,1)}
        /*a:hover：鼠标移到链接上时 ,如 */
        .mycls a:hover {color:rgb(0,0,0,.6)}

        .row {
            background-color: rgb(255,255,255,1);
        }

        .maincontainer{
            margin-top: 5px;
        }


        .mycard {
            float: left;
            margin-right: 10px;
            margin-bottom: 10px;
            width: 100%;
            position: relative;

        }

        .mycard:hover {
            background-color: #feefef
        }

        .mycard:hover >a {
            color: #ff2727
        }

        .mycard:hover .xl {
            display: inline-block;
            opacity: 1
        }

        .mycard:nth-child(8) {
            margin-right: 0
        }

        .mycard >a {
            display: block;
            font-size: 15px;
            padding: 15px 20px;
            line-height: 30px;
            padding-right: 30px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            transition: .2s all;
            color: #333;
            position: relative;
            border: 1px solid #f6f6f6;
            border-radius: 10px;
        }

        .mycard >a img {
            vertical-align: middle;
            margin-top: -3px;
            margin-right: 8px;
            width: 20px;
            height: 20px;
            border-radius: 3px;
        }

        .mycard >a .xl:after {
            content: " ";
            width: 0;
            height: 0;
            border-width: 5px 5px 0;
            border-style: solid;
            border-color: #ff2727 transparent transparent;
            margin-left: 6px;
            margin-top: 13px;
            display: block;
            transition: .2s all
        }

        .mycard >a .xlhover:after {
            transform: rotate(180deg)!important;
            margin-top: 12px
        }

        .mycard >a .xl {
            display: inline-block;
            vertical-align: middle;
            opacity: 0;
            width: 20px;
            height: 30px;
            position: absolute;
            right: 13px;
            top: 15px
        }

        .mycard .info {
            box-shadow: 0 0 9px rgba(23,23,23,0.12);
            background: #FFF;
            z-index: 99;
            width: 98%;
            left: 1%;
            position: absolute;
            top: 60px;
            padding: 8px 0;
            border-radius: 9px;
            display: none
        }

        .mycard .info a {
            display: block;
            height: 48px;
            line-height: 48px;
            padding: 0 10px;
            text-align: center;
            font-size: 15px;
            color: #333
        }

        .mycard .info a:hover {
            background: #feefef;
            color: #ff2727
        }
        .subLeftContainer{
            border-right:10px solid #f6f6f6;

        }

        .title{height:40px;overflow:hidden;position:relative}
        .title h3{line-height:40px;color:#333;font-size:17px;position:relative;padding-left:20px}
        .title h3:before{content:" ";position:absolute;left:0;top:11px;height:18px;width:3px;background:#20C4AB}
        .title a{position:absolute;right:0;top:0;height:40px;line-height:40px;font-size:15px;color:#b5b5b5}
        .title a i{font-size: 18px;display:block;height:40px;line-height:40px;color:#b7b7b7;}

        .guanggaocard{margin-bottom: 10px;border-bottom:10px solid #f6f6f6;padding-top: 5px;padding-bottom: 5px;height: 320px;}
        .guanggaocard > .title{height:40px;overflow:hidden;position:relative}
        .guanggaocard > .title h3{line-height:40px;color:#333;font-size:17px;position:relative;padding-left:20px}
        .guanggaocard > .title h3:before{content:" ";position:absolute;left:0;top:11px;height:18px;width:3px;background:#20C4AB}
        .guanggaocard > .title a{position:absolute;right:0;top:0;height:40px;line-height:40px;font-size:15px;color:#b5b5b5}
        .guanggaocard > .title a i{font-size: 18px;display:block;height:40px;line-height:40px;color:#b7b7b7;}


        .footer{background:#FFF;padding:0px 0;margin-top:13px;font-size:13px;color:#515151;text-align:center}
        .footer >div{max-width:calc(100% - 50px);margin:0 auto;}
        .footer >div ul{margin:0 auto;}


        .footer >div ul li{ list-style: none;float:left;width:180px}
        .footer >div ul li a{color:#949494;text-align:center;display:block;font-size:13px;height:40px;line-height:40px;width:100%}

        .footer >div div{margin:0 auto;}


        .jd_pro{
            float: left;
            width: 100%;
            position: relative;
            text-align:center;
        }
        .jd_pro a{
            display: block;
            font-size: 15px;
            padding: 15px 20px;
            line-height: 30px;
            padding-right: 30px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            transition: .2s all;
            color: #333;
            position: relative;
            border: 1px solid #f6f6f6;
            border-radius: 10px;

        }
        .jd_pro a img{
            width:200px;
            height: 200px;
        }
        .jd_pro p{

            display: block;

            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }



        @media screen and (max-width: 376px) {
            .cardRow{
                width: calc( (100% - (10.5px * 2) ) / 2 );
            }
            #logoimg{
                width: 112px;
                height: 41px;
            }


            .logoNew{
                position:relative;
                right:22px;
                top:0px;
                background:#f94c30;
                color:#FFF;
                padding:0 5px;
                height:15px;
                line-height:16px;
                border-radius:5px;
                font-size:12px;
            }
            .submain1{
                width: 50%;

            }
            .submain2{
                width: 50%;

            }

            .col-xs-12 .col-sm-12{
                padding-left: 2px;
                padding-right: 2px;
            }


            .mycard >a {

                padding: 5px 8px;

                padding-right: 10px;

            }

        }

    </style>
 <script src="/static/jslib/jquery.js" type="text/javascript"></script>

    <style>
        .carousel-cell {
            margin:0 auto;
            width: 100%; /* full width */
            max-height: 383px;
            height: 383px;
            line-height: 383px;

             text-align: center;
            display: -webkit-flex; /* Safari */
            display: flex;
            flex-direction: row;
        }
        .carousel-cell  a{
            color: #000000;
            text-align: center;
            width:100%;
            height: 408px;
        }
        .carousel-cell  a img{
            width: 230px;
            height: 322px;
            overflow: hidden;
        }
        .carousel-cell  a br{
            height: 0px;
        }
        .carousel-cell .text{
            height: 20px;
            line-height: 20px;
            margin-top:-20px;
            color: #0C0C0C;
        }
        /*.carousel-cell a span{*/
            /*text-align: center;*/
            /*margin-top: 2px;*/
            /*height: 20px;*/
            /*line-height: 20px;*/
            /*width: 100%;*/

        /*}*/

    </style>
<script>




    function render1(id){
        return new Flickity( id, {
            // 选项，默认值列表

            accessibility: true,
            // 启用键盘导航，按左右键

            adaptiveHeight: false,
            // 将幻灯片/轮播高度设置为所选的幻灯片

            autoPlay: 0,
            // 跳转到下一个单元格
            // 如果为 true, 默认间隔3秒
            // 或以毫秒为单位设置间隔时间
            // 例如 `autoPlay: 1000` 间隔为1秒

            cellAlign: 'center',
            // 对齐，“中心”，“左”或“右”
            // 或小数点0-1,0是容器的开始（左），1是结束（右）

            cellSelector: undefined,
            // 指定单元格元素的选择器

            contain: false,
            // 将包含单元格到容器
            // 所以在开始或结束时没有多余的滚动
            // 如果启用了 wrapAround ，则不起作用

            draggable: true,
            // 启用拖动和触摸

            dragThreshold: 3,
            // 用户必须水平滚动才能开始拖动的像素数
            // 增加触摸设备的垂直滚动空间

            freeScroll: true,
            // 使内容可以自由滚动和弹出
            // 不调整单元格

            friction: 0.2,
            // 较小的数字=更容易滑动

            groupCells: false,
            // 将组包含在幻灯片中

            initialIndex: 0,
            // 初始选定单元的基于0的索引

            lazyLoad: true,
            // 启用延迟加载图像
            // 设置图像 data-flickity-lazyload="src.jpg"
            // 设置为加载相邻单元格的图像

            percentPosition: true,
            // 以百分比值而不是像素设置定位
            // 如果项目具有百分比宽度，则启用
            // 如果项目具有像素宽度（如图像）则禁用

            prevNextButtons: true,
            // 创建并启用按钮以点击上一个和下一个单元格

            pageDots: true,
            // 创建并启用页面点

            resize: true,
            // 监听窗口调整大小事件，以调整大小和位置

            rightToLeft: false,
            // 实现从右到左的布局

            setGallerySize: true,
            // 设置画廊的高度
            // 如果图库已经使用CSS设置了高度，则禁用它

            watchCSS: false,
            // 观看内容：之后的元素
            // 如果激活 #element:after { content: 'flickity' }

            wrapAround: true
            // 在滑动结束时，首先使用无限滚动

        });
    }
</script>